<template>
  <div class="peopleitem" v-on:click="toPeopleDetail">
    <div class="avatar-content left">
      <!-- <img class="avatar" :src="peopleDetail.avatar? peopleDetail.avatar : noavatar" alt="图片"> -->
      <avatar :username="peopleDetail.name"  class="avatar"/>
    </div>
    <div class="right">
      <van-row type="flex" justify="space-between">
        <van-col span="17" class="peoplename">
          {{peopleDetail.name}}
          <van-tag style="bottom: 1px;" plain v-bind:type="peopleDetail.gender==0 ?'primary':'danger'">{{peopleDetail.gender==0? '男':'女'}}</van-tag>
        </van-col>
        <van-col span="7">{{peopleDetail.pubtime}}</van-col>

      </van-row>
      <van-row type="flex" justify="space-between">
        <van-col span="17">
          <van-row>
            <van-col class="companyname">{{peopleDetail.liveCity}}</van-col>
          </van-row>
          <van-row>
            <van-col class="gray van-ellipsis">推荐理由:{{peopleDetail.comments}}</van-col>
          </van-row>
        </van-col>
        <van-col span="7" class="bounce">{{peopleDetail.position}}</van-col>
      </van-row>
    </div>
  </div>
</template>

<script>
import Avatar from 'vue-avatar/src/Avatar'
export default {
  components:{
    Avatar
  },
  props:{
    peopleDetail:{
      type:Object,
      require: true
    }
  },
  methods: {
  toPeopleDetail(){
   this.$router.push({
	name:'peopledetail',
	query:{
          id: this.peopleDetail.resumeId
        }
   })
  }

  },
  data: function(){
    return{
      noavatar: 'http://img0.imgtn.bdimg.com/it/u=309420998,862661986&fm=27&gp=0.jpg'
    }
  },
  mounted(){
  }
}
</script>

<style lang="stylus" scoped>
.peopleitem{
  height 80px
  border-bottom solid 1px #eeeeee
  margin-bottom 8px
  background-color white
  padding 8px 16px
}
.avatar-content{
  height 70px
  padding 12px 0px 0px 0px
  float left
}
.avatar{
  height 60px
  padding 5px
  border-radius  100%
  margin-right 8px
}
.right{
  padding-top 10px
}
.bounce{
  // color #FF4500
  font-size 14px
  // line-height 38px
  // vertical-align middle
}
.peoplename{
  font-size 16px
  line-height 22px
}
.gray{
  color #808080
  font-size 10px
  line-height 22px
}
.companyname{
  line-height 22px
}
</style>

